<template>
	<view class="bg">
		<view class="in">
			<view class="input">
				<u-search placeholder="请输入关键词搜索" :show-action="true" bg-color=" rgba(255,255,255,0.1)" v-model="searchtext" @custom="customFn"></u-search>
			</view>
		</view>
		<view class="content">
			订阅【药材采购】里的品种后，将会推送发布带有相关药材采购品种内容。
		</view>
		<view class="dingyue">
			<view class="dingyue-item" v-for="(item,index) in dataList" :key="item.id">
				<view class="dingyue-item-left">
						{{item.name}}
				</view>
				<view class="dingyue-item-right" @click="dingyueFn(item.id)" v-if="ding.indexOf(item.id+'')<0">
					订阅
				</view>
				<view class="dingyue-item-right1" @click="dingyueFn(item.id)" v-if="ding.indexOf(item.id+'')>=0">
					已订阅
				</view>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
// import { getDecorate } from '@/api/shop'
	import { getdingyue,getding } from '@/api/news'
import { onLoad } from '@dcloudio/uni-app';
import { reactive,ref } from 'vue'
	import { useUserStore } from '@/stores/user'
	import { storeToRefs } from 'pinia'
	const userStore = useUserStore()
	const { userInfo, isLogin } = storeToRefs(userStore)

	const searchtext=ref('')
const state = reactive<{
    pages: any[]
}>({
    pages: []
})
onLoad(()=>{
	userStore.getUser()
	getdata()
	getdingyueFn()
})
	
	let ding=ref([]);
	const getdingyueFn=()=>{
		ding.value=userInfo.value.dingyue.split(",")
		console.log(ding.value);
	}

	const dataList=ref([])
	const getdata=async()=>{
		try {
		    let data = await getdingyue()
			dataList.value=data.lists
			
			
		} catch (e) {
		    console.log('报错=>', e)
		}
	}



const dingyueFn=async(id)=>{
	uni.showLoading({
			title:'加载中',
			mask:true
		})
	try {
	    let data = await getding({
			id:id
		})
		// dataList.value=data.lists
		userStore.getUser().then(()=>{
			getdingyueFn()
			uni.hideLoading();
		})
		// getdata()
		// reload()
	} catch (e) {
	    console.log('报错=>', e)
	}
}
	const customFn=async()=>{
		// console.log('搜索');
		// console.log(searchtext.value,'searchtext');
		try {
		    let data = await getdingyue({
		      name:searchtext.value
		    })
			dataList.value=data.lists
		
			
		} catch (e) {
		    console.log('报错=>', e)
		}
	}
// getData()
</script>

<style scoped lang="scss">
	.bg{
		background-color: #fff;
	}
	.in{
		background-color: #fff;
		padding-top: 28rpx;
	}
	.input{
		margin-top: 28rpx;
		margin-bottom: 28rpx;
		width: 94%;
		margin-left: 3%;
		background-color: rgba(0,187,120,0.04);
	border: 3rpx solid #06BE7C;
	border-radius: 16rpx 16rpx 16rpx 16rpx;
	}
	.content{
		width: 94%;
		margin-left: 3%;
		font-weight: bold;
		font-size: 30rpx;
		color: #333;
		padding-bottom: 20rpx;
		border-bottom: 2rpx solid #333;
	}
	.dingyue{
		width: 94%;
		margin-left: 3%;
		background-color: #fff;
	}
	.dingyue-item{
		display: flex;
		height: 90rpx;
		line-height: 90rpx;
		font-size: 24rpx;
		align-items: center;
	}
	.dingyue-item-left{
		
	}
	.dingyue-item-right{
		margin-left: auto;
		width: 140rpx;
		height: 50rpx;
		background-color: #18b464;
		border-radius: 10rpx;
		color: #fff;
		line-height: 50rpx;
		text-align:center;
	}
	.dingyue-item-right1{
		margin-left: auto;
		width: 140rpx;
		height: 50rpx;
		background-color: #a0a0a0;
		border-radius: 10rpx;
		color: #fff;
		line-height: 50rpx;
		text-align:center;
	}
</style>
